<template>
	<el-dialog class="Blue" :title="$t('map.userConfig')" width="40%" :visible="$store.state.user.visibles.userConfigDialog" :before-close="handleClose" :lock-scroll="false">
	  <el-form ref="form" label-width="80px">
			<el-form-item :label="$t('map.userConfigLanguage')">

				<el-select v-model="lang" @change="changeLang" placeholder="请选择">
				 <el-option
					 v-for="item in $store.state.common.langs"
					 :key="item.value"
					 :label="item.label"
					 :value="item.value">
				 </el-option>
			 </el-select>
			</el-form-item>
		</el-form>
		<div slot="footer" class="dialog-footer">
			<el-button @click="handleClose">{{$t('common.cancel')}}</el-button>
			<el-button type="primary" @click.native="editSubmit">{{$t('common.ok')}}</el-button>
		</div>

	</el-dialog>
</template>

<script>
	import {  } from '@/api/api';
	export default {
		name: 'UserConfig',
		data() {
			return {
					lang:localStorage.lang?localStorage.lang:'zh_CN',
			}
		},
		methods: {
			handleClose: function() {
				this.$store.dispatch('setVisblesFlag', [{key:'userConfigDialog',value:false}]);
			},
			editSubmit(){
				this.handleClose();
			},
			changeLang(val){
				this.$i18n.locale = val;
				localStorage.lang = val;
				store.dispatch('initSystem',[{key:'lang',value:val}]);
			},

		},
		mounted() {

		}
	}
</script>
